<html>
    <head>
        <title>局部注册</title>
    </head>
    <body>
        <script>
             // 三、局部注册
                            /*
                                  全局注册往往是不够理想的。
                                  比如，如果使用一个像webpack这样的构建工具，全局注册所有的组件意味着即便你已经不再使用一个组件了，
                                  它仍然会被包含在你最终的构建结果中。
                                  这造成了用户下载的JavaScript的无所谓的增加。
                            */

                            //  在这中情况下，你可以通过一个普通的JavaScript对象来定义组件：
                                    var ComponentA = {/*....*/}
                                    var ComponentB = {/*....*/}
                                    var ComponentC = {/*....*/}

                                // 然后在创建vue实例时，通过 components选项来"局部注册"你想要实例中使用的组件：
                                    new Vue({
                                      el:'#app',
                                      components:{   // 局部注册组件，这里的属性值就是组件的选项对象，这里的属性名就是组件名
                                        'component-a':ComponentA,
                                        'component-b':ComponentB,
                                        'component-c':ComponentC
                                      }
                                    })

                                /*
                                    对于 components 对象中的每个 property来说，其 property 名就是"自定义元素的名字"，

                                    其property值就是这个组件的 "选项对象"

                                    注意：  局部注册的组件在其子组件中不可用。
                                */ 
        </script>
    </body>
</html>